// 导航
var dropdown = document.querySelector('.dropdown');
var yin = document.querySelector('.yin');
var cang = document.querySelector('.cang');
dropdown.onmouseover = function() {
	cang.style.display = 'block';
	yin.style.display = 'none';
}
dropdown.onmouseout = function() {
	cang.style.display = 'none';
	yin.style.display = 'block';
}
// 二
var one = document.querySelector('.one');
var yino = document.querySelector('.yino');
var cango = document.querySelector('.cango');
one.onmouseover = function() {
	cango.style.display = 'block';
	yino.style.display = 'none';
}
one.onmouseout = function() {
	cango.style.display = 'none';
	yino.style.display = 'block';
}
// 三
var two = document.querySelector('.two');
var yint = document.querySelector('.yint');
var cangt = document.querySelector('.cangt');
two.onmouseover = function() {
	cangt.style.display = 'block';
	yint.style.display = 'none';
}
two.onmouseout = function() {
	cangt.style.display = 'none';
	yint.style.display = 'block';
}
// 四
var zhong = document.querySelector('.zhong');
var zho = document.querySelector('.zho');
var ng = document.querySelector('.ng');
zhong.onmouseover = function() {
	zho.style.display = 'none';
	ng.style.display = 'block';
}
zhong.onmouseout = function() {
	zho.style.display = 'block';
	ng.style.display = 'none';
}
// 返回顶部
var ding = document.querySelector("#ding")

window.onscroll = function() {
	console.log(document.documentElement.scrollTop || document.body.scrollTop);

	if (document.documentElement.scrollTop > 1000 || document.body.scrollTop) {
		ding.style.display = "block";
	} else {
		ding.style.display = "none";
	}
}

ding.addEventListener('click', function() {
	window.scrollTo(0, 0);
	// window.scrollTo({
	// 	top:0,
	// 	behavior:'smooth'
	// });
})
// 地图

var c = document.querySelector(".card");
var d = document.querySelector(".di");
c.onclick = function() {
	d.style.display = "block";
}

d.onmouseover = function() {
	d.style.display = "block";
}
d.onmouseout = function() {
	d.style.display = "none";
}
// 选项卡
var zil = document.querySelectorAll('.zil>li');
var tur = document.querySelectorAll('.tur>li');
for (var i = 0; i < zil.length; i++) {
	zil[i].index = i;
	zil[i].addEventListener('click', function() {
		for (var j = 0; j < zil.length; j++) {
			zil[j].classList.remove('zi');
			tur[j].classList.remove('img');
		}
		console.log(this);
		console.log(this.index);
		this.classList.add('zi');
		tur[this.index].classList.add('img')
	})

}
// /JSON
// json
new Vue({
	el: "#ba",
	data: {
		message: "Hi",
	},
	mounted() {
		axios
			.get('js/news.json')
			.then(response => this.message = response.data.urls)
			.catch(function(error) {
				console.log(error);
			})
	}
})